<script setup>

import moduleJson from "@/components/page/moduleJson"
import dataJson from "@/components/page/dataJson"
import {inject, nextTick, onMounted, ref} from "vue";
import ModelService from "@/service/impl/ModelService.js";
import ModelList from "@/model/ModelList.js";
import SentenceConfig from "@/components/language/SentenceConfig.vue";
import dialogJson from "@/components/dialog/dialogJson.js";
import ClassificationService from "@/service/impl/ClassificationService.js";
import ImageConfig from "@/components/iamge/ImageConfig.vue";
import ImageClassificationService from "@/service/impl/ImageClassificationService.js";

const imageConfigDialog = dialogJson()
const t = inject('$t')
const message = inject('message')
const data = dataJson()
const module = moduleJson()
const modelList = ref(new ModelList())
const currentData = ref(null)

onMounted(() => {
    module.value.page.show = true
    module.value.init(null, null,
        ModelService.url.modelDel, null, null)
    module.value.operations.width = "200px"
    module.value.dialog.width = "40%"
    init()
})


const init = () => {
    module.value.dialog.show = false
    modelList.value.modelType = 3
    data.value.data = modelList.value
    ModelService.modelList(data.value.source()).then(res => {
        data.value.init(res)
    })
}

const training = (row) => {
    imageConfigDialog.value.show = true
    imageConfigDialog.value.title = "设置参数"
    imageConfigDialog.value.width = "40%"
    row.data.modelConfig.remark = row.data.remark
    imageConfigDialog.value.data = row.data.modelConfig
    currentData.value = row.data
}


const delConfirm = (obj) => {
    ModelService.modelDel(obj).then(res => {
        init()
    })
}

// const onTraining = () => {
//     if(!currentData.value){
//         return
//     }
//     ModelService.fineTune(currentData.value).then(res => {
//
//     }).catch(e => {
//
//     })
// }

// const test = () => {
//     const input = document.createElement('input');
//     input.type = 'file';
//     input.accept = 'image/*';
//     let t1 = data.value.list.find(item => item.id === imageClassificationModel.value.id);
//     if(!imageClassificationModel.value.id || !t1){
//         message.warning("请选择分类")
//         return
//     }
//     input.onchange = (event) => {
//         const file = event.target.files[0];
//         if (file) {
//             if (!allowedTypes.includes(file.type)) {
//                 message.warning('只能上传图片文件');
//                 return;
//             }
//             testTrainingLoding.value = true
//             // 这里可以添加上传逻辑，例如使用FormData和fetch或axios发送文件
//             ImageClassificationService.testTraining({
//                 file: file,
//                 id: t1.id
//             }).then(res => {
//
//                 testImageShow.value = true
//                 testTrainingLoding.value = false
//                 let imageUrl = url + res.data
//                 nextTick(() => {
//                     let imageById = document.getElementById("test-image");
//                     let testImageContainer = document.getElementById("test-image-container")
//                     const parentWidth = testImageContainer.offsetWidth;
//                     const parentHeight = testImageContainer.offsetHeight;
//                     const widthRatio = parentWidth / Number(t1.imageWidth) ;
//                     const heightRatio = parentHeight / Number(t1.imageHeight);
//                     const scaleRatio = Math.min(widthRatio, heightRatio);
//                     imageById.style.width = `${t1.imageWidth * scaleRatio - 50}px`;
//                     imageById.style.height = `${t1.imageHeight * scaleRatio - 50}px`;
//                     imageById.src = imageUrl
//                 })
//
//             })
//         }
//     };
//     input.click();
// }

</script>
<template>
    <Page
        @refresh="init"
        :data="data"
        :module="module"
        @del-confirm="delConfirm"
        @page-current-change="init"
        @page-size-change="init"
    >
        <template #table-left>
        </template>
        <template #operate-before>
<!--            <el-button type="primary" @click="test">测试</el-button>-->
        </template>
        <template #table-column>
            <el-table-column type="selection" width="55"/>
            <el-table-column prop="remark" label="备注"/>
            <el-table-column prop="userName" label="操作人"/>
            <el-table-column prop="createTime" label="创建时间"/>
        </template>
        <template #after-table-event="row">
<!--            <el-button type="primary" @click="training(row)">微调</el-button>-->
        </template>
        <template #table-dialog>
        </template>
        <template #table-search>

        </template>
    </Page>

<!--    <image-config :imageConfigDialog="imageConfigDialog" :fineTune="true" @onTraining="onTraining" />-->

</template>

<style lang="scss" scoped>

</style>
